<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/search.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2867324_7xohefn514c.css">
    <title>Document</title>
</head>
<body>
    <!-- 下载APP -->
    <div class="download">
        <div class="downloadApp">
            <div class="deleteButton">
                <span class="iconfont icon-shanchu2"></span>
            </div>
            <div class="downloadText">
                <p class="downloadTitle">品牌特卖 就是超值</p>
                <p class="downloadBottom">早10晚8准点上新，7天放心退</p>
            </div>
        </div>
        <div class="downloadPrivacy">
            <span class="edition">开发者：广州唯品会信息科技有限公司&nbsp;&nbsp;版本号：v7.54.7</span>
            <span class="Privacy">
                <a href="#">权限</a>
                <span>|</span>
                <a href="#">隐私</a>
            </span>
        </div>
    </div>
    <!-- 搜索框 -->
    <div class="search">
        <i class="iconfont icon-arrow-left"></i>
        <input type="text" placeholder="玖姿集团大牌日">
        <div class="text">搜索</div>
    </div>
    <!-- 标签 -->
    <div class="container">
        <div class="title">
            <span>热门搜索</span>
        </div>
        <div class="tag">
            <span class="select">大牌羽绒298元起</span>
            <span class="select">玖姿大牌日 同价11.11</span>
            <span class="select">玖姿爆款 低至1.1折</span>
            <span class="select">羽绒服低至99元</span>
            <span class="select">年度爆款</span>
            <span>女式大衣</span>
            <span>女靴</span>
            <span>护肤套装</span>
            <span>水星</span>
            <span>女式休闲裤</span>
            <span>男式夹克</span>
            <span>女休闲鞋</span>
            <span>手机</span>
            <span>男休闲鞋</span>
            <span class="select">一次性口罩</span>
        </div>
    </div>
    <!-- 购物车 -->
    <div class="shoppingCar">
        <i class="iconfont icon-gouwuchekong"></i>
    </div>
</body>
<script>
    // 在iphone6 375宽度中  html是以20px作为基本单位
    (function () {
        function w() {
            var all = document.documentElement;  // 获取html元素
            var test = all.getBoundingClientRect().width;  // 获取当前设备的宽度、
            console.log(123, test)
            if (test > 750) {
                test = 750;
            }
            rem = test / 18.75;
            console.log(rem)
            all.style.fontSize = rem + 'px'
        }
        w();
        window.addEventListener("resize", function () {
            w()
        }, false)
    })();

</script>
</html>